import './public-path'
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'

let root = ReactDOM.createRoot(document.getElementById('root'))

// 与基座的数据交互
function handleMicroData () {
  // 是否是微前端环境
  if (window.eventCenterForAppNameVite) {
    // 主动获取基座下发的数据
    console.log('child-vite getData:', window.eventCenterForAppNameVite.getData())

    // 监听基座下发的数据变化
    window.eventCenterForAppNameVite.addDataListener((data) => {
      console.log('child-vite addDataListener:', data)
    })

    // 向基座发送数据
    setTimeout(() => {
      window.eventCenterForAppNameVite.dispatch({ myname: 'child-vite' })
    }, 3000)
  }
}

function mount () {
  if (!root._internalRoot) {
    root = ReactDOM.createRoot(document.getElementById('root'))
  }
  root.render(
    <React.StrictMode>
      <App />
    </React.StrictMode>
  )

  console.log('微应用child-react渲染了')

  handleMicroData()
}

// 将卸载操作放入 unmount 函数
function unmount () {
  root.unmount()
  console.log('微应用child-react卸载了')
}

// 微前端环境下，注册mount和unmount方法
if (window.__MICRO_APP_ENVIRONMENT__) {
  // @ts-ignore
  window[`micro-app-${window.__MICRO_APP_NAME__}`] = { mount, unmount }
} else {
  // 非微前端环境直接渲染
  mount()
}
